<template>
  <view class="modalCenter modalLogin" @click="hide">
    <view class="inner" @click.stop="stop">
      <view class="innerHeader">
        <view class="title">登录</view>
        <view class="closeBtn" @click="hide"></view>
      </view>
      <view class="innerBody">
        <view class="inputWrap">
          <view class="inputLabel">手机号</view>
          <input class="inputStyle" v-model="mobile" placeholder="请输入手机号" type="number"/>
          <!--<button class='btn' type="default" @tap="sendSmsCode('login')">发送验证码</button>-->
        </view>
        <view class="inputWrap">
          <view class="inputLabel">密_1_码</view>
          <input class="inputStyle" v-model="password" placeholder="请输入密码" type="number"/>
        </view>
      </view>
      <view class="innerFooter">
        <view class="btnBasic btnConfirm" @click="btnCommitRegister">注册</view>
        <view class="btnBasic btnConfirm" @click="btnCommitLogin">登录</view>
        <!--<view class="btnConfirm" @click="btnCommitPWReset">重置</view>-->
      </view>
    </view>
  </view>
</template>

<script>
import { modelSet } from '../../store/modelOpt'

export default {
  data(){
    return {
      mobile: '',
      password: '',
    }
  },
  props: {
    visible: {
      // 星星的类型，是否镂空
      type: [String],
      default: '默认值',
    },
    clickHandler: {},
  },
  onReady: function (){
  },
  onUnload: function (){
    console.log(`123425435`, 123425435)
  },
  onLoad(){
    console.log(`123425435`, 546788543)
  },
  onReachBottom(){
  },
  onPullDownRefresh(){
  },
  methods: {
    hide(){
      this.modelSet('home.modalLoginVisible', false)
    },
    stop(){
    },
    linkTo(url){
      console.log(`url`, url)
      uni.navigateTo({ url })
    },
    btnCommitRegister(){
      uniCloud.callFunction({
        name: 'user-center',
        data: {
          action: 'register',
          params: {
            username: this.mobile,
            password: this.password,
            // needPermission: this.needPermission,
          },
        },
        success: (res) => {
          console.log(`res.result`, res.result)
          if (res.result.code === 0) {
            this.modelSet('home.modalLoginVisible', false)
            uni.setStorageSync('uni_id_token', res.result.token)
            uni.setStorageSync('uni_id_token_expired', res.result.tokenExpired)
            uni.showToast({ title: res.result.message, icon: 'none' })
          } else { // 20102 用户已经存在  10102 密码错误
            uni.showToast({ title: res.result.message, icon: 'none' })
          }
        },
        fail: (res) => {
          console.error(e)
        },
      })
    },
    btnCommitPWReset(){
      console.log(`重置密码`)
      uniCloud.callFunction({
        name: 'user-center',
        data: {
          action: 'resetPwd',
          params: {
            otherUserId: '',
          },
        },
        success: (res) => {
          console.log(`res`, res)
        },
        fail: (res) => {
          console.error(e)
        },
      })
    },
    btnCommitLogin(){
      uniCloud.callFunction({
        name: 'user-center',
        data: {
          action: 'login',
          params: {
            username: this.mobile,
            password: this.password,
            // needPermission: this.needPermission,
          },
        },
        success: (res) => {
          console.log(`res.result`, res.result)
          if (res.result.code === 0) {
            this.modelSet('home.modalLoginVisible', false)
            uni.setStorageSync('uni_id_token', res.result.token)
            uni.setStorageSync('uni_id_token_expired', res.result.tokenExpired)
            this.modelSet('userInfo', res.result.userInfo)
            uni.showToast({ title: res.result.message || '登录成功~', icon: 'none' })
          } else { // 20102 用户已经存在  10102 密码错误
            uni.showToast({ title: res.result.message, icon: 'none' })
          }
        },
        fail: (e) => {
          console.error(e)
        },
      })
    },
    sendSmsCode(type){
      if (!/^1\d{10}$/.test(this.mobile)) {
        uni.showModal({
          content: '请输入正确的手机号',
          showCancel: false,
        })
        return
      }
      uniCloud.callFunction({
        name: 'user-center',
        data: {
          action: 'sendSmsCode',
          params: {
            mobile: this.mobile,
            code: this.code,
            type,
            templateId: '10109',
          },
        },
        success(res){
          uni.showModal({
            showCancel: false,
            content: JSON.stringify(res.result),
          })
        },
        fail(e){
          console.error(e)
          uni.showModal({
            showCancel: false,
            content: '发送失败，请稍后再试',
          })
        },
      })
    },
  },
}
</script>

<style lang="scss">
@import "./index.scss";

.modalLogin {
  .inputWrap {
    display: flex;
    align-items: center;
    padding: 20px 0;
    .inputLabel {
      font-size: 28px;
      white-space: nowrap;
    }
    .inputStyle {
      font-size: 28px;
      margin: 0 auto 0 20px;
    }
    .btn {
      font-size: 28px;
      width: auto;
      margin: 0;
      padding: 0;
      &:after {
        border: none;
        padding: 0;
      }
    }
  }
  .btnWrap {
    margin-top: 40px;
  }
}
</style>
